<template>
  <i class="duyi-icon" :class="{ [`duyi-icon--${type}`]: type }">
    <!-- font-awesome-icon这个组件是fontawesome为我们提供的 -->
    <!-- 我们需要对这个组件进行一个二次封装 -->
    <font-awesome-icon v-bind="filteredProps" />
  </i>
</template>

<script setup>
import { computed } from 'vue'
import { omit } from 'lodash-es'
import propObj from './props.js'
defineOptions({
  name: 'DuyiIcon',
})
const props = defineProps(propObj)

// 过滤掉自定义属性
const filteredProps = computed(() => omit(props, ['type']))
</script>

<style lang="scss" scoped></style>
